<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css">
</head>
<body ontouchstart>
<div class="weui-toptips weui-toptips_warn js_tooltips">错误提示</div>
<div class="container">
    <div class="page js_show">
        <form action="">
            <div class="weui-cells__title">用户登录</div>
            <div class="weui-cells weui-cells_form">
                <div class="weui-cells">
                    <div class="weui-cell weui-cell_select weui-cell_select-before">
                        <div class="weui-cell__hd">
                            <select class="weui-select" name="select2">
                                <option value="1">+86</option>
                                <option value="2">+80</option>
                                <option value="3">+84</option>
                                <option value="4">+87</option>
                            </select>
                        </div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="number" pattern="[0-9]*" placeholder="请输入号码">
                        </div>
                    </div>
                </div>
                <div class="weui-cell weui-cell_vcode">
                    <div class="weui-cell__hd">
                        <label class="weui-label">图形验证码</label>
                    </div>
                    <div class="weui-cell__bd weui-cell_primary">
                        <input type="number" class="weui-input">
                    </div>
                    <div class="weui-cell__ft">
                        <img src="/img/weui/vcode.jpg" alt="">
                    </div>
                </div>
                <div class="weui-cell weui-cell_vcode">
                    <div class="weui-cell__hd">
                        <label class="weui-label">手机验证码</label>
                    </div>
                    <div class="weui-cell__bd">
                        <input class="weui-input" type="tel" placeholder="请输入验证码">
                    </div>
                    <div class="weui-cell__ft">
                        <button class="weui-vcode-btn">获取验证码</button>
                    </div>
                </div>
            </div>
            <div class="weui-cells__tips"></div>
            <div class="weui-btn-area">
                <a href="" class="weui-btn weui-btn_primary">登录</a>
            </div>
            <div class="weui-btn-area">
                <a href="/mobile/register" class="weui-btn weui-btn_default">没账户，去注册</a>
            </div>
        </form>
        <label for="weuiAgree" class="weui-agree">
            <input id="weuiAgree" type="checkbox" class="weui-agree__checkbox"/>
            <span class="weui-agree__text">
                阅读并同意<a href="javascript:void(0);">《相关条款》</a>
            </span>
        </label>
    </div>
</div>
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/jquery-weui.min.js"></script>
<!-- 如果使用了某些拓展插件还需要额外的JS -->
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/swiper.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/city-picker.min.js"></script>
<script>
    $(function(){
        //点击更换验证码
        $('.weui-vcode-img').on('click',function(){
            var src = '';
            if($(this).attr('src').indexOf('random')==-1){
                src = $(this).attr('src');
            }else{
                src = $(this).attr('src').split('?')[0];
            }
            $(this).attr('src',src+'?random='+Math.random());
        });
    });
</script>
</body>
</html>